<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<%@ page contentType="text/html;charset=UTF-8" %>
<html>
<head>
    <style>
        .personal ul{
            padding: 0px;
        }

        .personal ul li{
            list-style-type: none;
            border: 1px solid;
            border-radius: 15px;
            padding: 1%;
            margin: 1%;
            width: 97%;
        }
    </style>
</head>
<body>
    <jsp:include page="head.jsp"></jsp:include>
<div style="overflow:scroll;" id="body" class="body">
    <div>
        <div class="easyui-accordion personal">
            <div title="我的订单" data-options="iconCls:'icon-more'" style="overflow:auto;padding:10px;">
                <ul>
                    <c:if test="${fn:length(orders) == 0}">无</c:if>
                    <c:forEach items="${orders}" varStatus="i" var="order">
                        <li>
                            <div>
                                <div>${order.title}</div>
                                <div>入住时间：${order.checkInTime} ~ ${order.checkOutTime}</div>
                                <div>入住时长：${order.leaseTime}月</div>
                                <div>订单价格：${order.price}元</div>
                                <div><a href="javascript:void(0);" onclick="showRepair('${order.id}')">点我故障报修>>></a></div>
                            </div>
                        </li>
                    </c:forEach>
                </ul>
            </div>
            <div title="我的报修" data-options="iconCls:'icon-more'" style="padding:10px;">
                <ul>
                    <c:if test="${fn:length(repairs) == 0}">无</c:if>
                    <c:forEach items="${repairs}" varStatus="i" var="repair">
                        <li>
                            <div>
                                <div>${repair.title}</div>
                                <div>说明：${repair.remark}</div>
                                <div>报修时间：${repair.createTime}</div>
                                <c:if test="${repair.status == '0'}">
                                    <div>状态：已报修</div>
                                </c:if>
                                <c:if test="${repair.status == '1'}">
                                    <div>状态：维修中</div>
                                </c:if>
                                <c:if test="${repair.status == '2'}">
                                    <div>状态：已完成</div>
                                </c:if>
                                <div>维修完成时间：${repair.completionTime}</div>
                            </div>
                        </li>
                    </c:forEach>
                </ul>
            </div>
            <div title="我的消息" data-options="iconCls:'icon-more'" style="padding:10px;">
                <ul>
                    <c:if test="${fn:length(messages) == 0}">无</c:if>
                    <c:forEach items="${messages}" varStatus="i" var="message">
                        <li>
                            <div>
                                <div>${message.title}</div>
                                <div>${message.content}</div>
                                <div>创建时间：${message.createTime}</div>
                            </div>
                        </li>
                    </c:forEach>
                </ul>
            </div>
            <div title="操作" data-options="iconCls:'icon-more', selected:true" style="padding:10px;">
                <a href="/loginOut" class="easyui-linkbutton c6" style="width:100%">注销</a>
            </div>
        </div>
    </div>
</div>

    <div id="dlgSave" class="easyui-dialog dlg-save" data-options="closed:true,modal:true,border:'thin',buttons:'#dlg-buttons'">
        <form id="fmSave" method="post" novalidate>
            <input type="hidden" id="orderId" name="orderId" value="">
            <table cellpadding="5">
                <tr>
<%--                    <td colspan="1">说明:</td>--%>
                    <td colspan="5">
                        <input id="remark" name="remark" class="easyui-textbox" data-options="multiline:true, prompt: '请说明详细情况'"  style="height:300px;white-space:pre-wrap" label="">
                    </td>
                </tr>
            </table>
        </form>
    </div>
    <div id="dlg-buttons">
        <a href="javascript:void(0)" class="easyui-linkbutton c6" iconCls="icon-ok" onclick="save()" style="width:90px">提交</a>
        <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-cancel" onclick="javascript:$('#dlgSave').dialog('close')" style="width:90px">取消</a>
    </div>

<script>

    $(function(){
        $("#body").css("height", $(window).height() - 70);
        // $(".personal").accordion('getSelected').panel('collapse');
        remind();
    });


    /**
     * 提醒
     */
    function remind() {
        $.ajax({
            url: "/message/remind",
            type: "POST",
            contentType: "application/json",
            dataType: "json",
            success: function(result) {
                if (result.success){
                    $.messager.show({
                        title: result.data.title,
                        msg: result.data.content
                    });
                }
            }
        });
    }

    function showRepair(orderId) {
        $("#orderId").val(orderId);
        $('#dlgSave').dialog('open').dialog('center').dialog('setTitle','故障报修');
    }

    function save() {
        $('#fmSave').form('submit',{
            url: '/repair/manage/saveOrUpdate',
            onSubmit: function() {
                return $(this).form('enableValidation').form('validate');
            },
            success: function(data) {
                let res = $.parseJSON(data);
                console.log(res);

                if(res.success) {
                    $.messager.show({
                        title: 'Success',
                        msg: '报修成功！'
                    });
                } else {
                    $.messager.show({
                        title: 'Error',
                        msg: res.msg
                    });
                }

                $('#dlgSave').dialog('close');
            }
        });
    }
</script>
</body>
</html>